home *** CD-ROM | disk | FTP | other *** search
/ Amiga Collections: Topik / Topik - Disk 29 - Icons (1990-07-12)(Topik Public Domain)(PD)[f Topik][WB].zip / Topik - Disk 29 - Icons (1990-07-12)(Topik Public Domain)(PD)[f Topik][WB].adf / C / TheArtOfIcons / TheArtOfIcons
Text File  |  1990-04-18  |  9KB  |  154 lines
  1.  
  2.  
  3. The Art of Icons
  4. ~~~~~~~~~~~~~~~~
  5.       Tutorial by Robert Lang.
  6.  
  7. Thankfully the Amiga was designed with a lot of personalisation in mind.
  8. The addition of preferences allows you to set your own colours,
  9. external device settings, and even modify the familiar pointer which is
  10. linked by software to the movement of the mouse.  An extra degree of
  11. personalisation was added when the icons were introduced.  Sadly, however,
  12. this is an area that is seldom used to its extent, and the explanation is
  13. probably ignorance more than complication.
  14.  
  15. With the addition of programs such as Anim8bench on Megadisc 9, the icon
  16. world has been enhanced even further.  Such enhancement is only available
  17. because the designers of the Amiga didn't lay down restrictions, but instead
  18. set defaults.  Therefore further expansion may enhance the personal world of
  19. the Amiga even more, but until then we should all get down to becoming
  20. experts on what we've got.  In this article I hope to give you a detailed
  21. description of how to make icons for the Amiga, and point out that the
  22. technique is the same for 4 to 8 colours, its just that you have a few more
  23. colours in the latter mode.  I also advise that you get a letter off to
  24. Megadisc and get your hands on the Theme Disc I made which is called the
  25. "Icon WorkDisk".  This disk is not a disk chokker-blok of every utility ever
  26. made to work with icons, but instead is an environment set up with just
  27. enough to creat icons of the best potential.
  28.  
  29. Onto the article, and obviously we begin by drawing our front picture.  I
  30. advise the use of any of the Deluxe Paint versions here, but any graphics
  31. program which works in IFF standards is fine.  You should be working in the
  32. resolution marked "Medium" on Dpaint, which is 640x200 pixels.  Select 4 or
  33. 8 colours as desired, and probably the best thing to do is to set the
  34. colours as close as possible to the workbench for which you are designing
  35. the icons.  On my Theme Disk, I have set the colours to normal workbench
  36. colours, and saved it as a picture so that the picture can be clicked on,
  37. hence loading DPaint with the preset colours.   If we label the colours on
  38. the DPaint as follows:
  39.      ----- -----      Where colour 1 is the colour which appears as the
  40.      | 1 | | 5 |      background in workbench (i.e. normally Blue), colour 3
  41.      ----- -----      is the colour which is used for such things as the
  42.      | 2 | | 6 |      front/back gadget in the top right hand corner of
  43.      ----- -----      windows (i.e. normally Black), colour 2 is the colour
  44.      | 3 | | 7 |      which is used for such things as the text and window
  45.      ----- -----      border (i.e. normally white), and lastly the 4th
  46.      | 4 | | 8 |      colour is the colour used for the cursor in Ed (i.e.
  47.      ----- -----      (i.e. normally orange).  These colours are the only
  48. ones which apply in 4 colour editing, but in 8 colour editing the other four
  49. colours appear.  Using Anim8Bench, colour 5 Flashes, while 6,7, and 8 all
  50. cycle around.  If Anim8Bench is not on, then the colours on the right
  51. correspond to the ones exactly to the left (5 shows as 1, 6 as 2, etc.), and
  52. hence wonderful effects can be achieved by hiding pictures until Anim8Bench
  53. is activated.  For instance, a square in colour 3 with the word "ROBERT"
  54. written on it in colour 7 will show as just a square in colour 3 in normal
  55. workbench.  When Anim8Bench is activated, the word "ROBERT" will be seen as
  56. flashing within the square of colour 3.  My Megadisc 10 icon uses a lot of
  57. this "hiding".
  58.  
  59. So once you've drawn a picture, you need to draw an alternate image if you
  60. want one.  I heavily advise the usage of alternate images, as such icons are
  61. indeed more popular, and rightly so.  To do this, the best technique in
  62. Dpaint is to draw it on the alternate screen.  This screen is accessed by
  63. pressing j (being careful that the CAPS LOCK is not on!) to toggle between
  64. the two screens.  The artist can then place the front and the back of the
  65. icon (I refer to the "back" as the view when the icon is selected...) by
  66. pushing j.  This gives him or her and idea of what the icon will look like
  67. when in use.
  68.  
  69. Once the two pictures are drawn, and satisfactorially finished, then it is
  70. time for the hard part, but in fact the shortest part.  The conversion of
  71. the picture into a usable icon is obviously the critical step and without
  72. a doubt the step which separates the sheep from the goats.  There are many
  73. methods of doing this, I will obviously tell you mine which is evidently
  74. effective, as proven by icons on previous Megadiscs.
  75.  
  76. I begin by drawing a box around the two icons, in the same place for
  77. each icon, so as to guide me with regards to the size of the icon.  Wierd
  78. effects can be achieved by making the front and back different sizes, and a
  79. lot of the time these effects are undesirable.  This box does not end up
  80. part of the icon at all, so it can be in any colour.
  81. Now, I "zoom" into the top left hand corner of the guide box I just drew, and
  82. select the "Makebrush" gadget on Dpaint.  Now I go over to the pixel just
  83. INSIDE the guide box and press and hold the left mouse button.  I then use
  84. the cursor keys to move down to the bottom right corner of the guide box and
  85. release the left mouse button when over the pixel just inside the guide box.
  86. This has therefore effectively made a brush out of the icon, and it can be
  87. saved using BRUSH and then SAVE on the menu bar.  I use a .fb after the name
  88. to indicate that it is a "front" brush.  The same can be done for the
  89. alternate image, this time using a .bb after the name for a "back" brush.  I
  90. also place brushes, icons and pictures in separate drawers.
  91.  
  92. Notice how the guide box was used to ensure the two icons were the same
  93. size.  You are effectively taking the box on pixel inside the guide box.
  94. You could of course use two, three, four, etc pixels inside the box, just as
  95. long as you know so that the two icons are the same.  If you are doing
  96. serious editing, it may also be wise to save each screen you are editing on,
  97. but that is purely your own choice.
  98.  
  99. Now you exit Dpaint and the fun really begins.  You need some utility which
  100. converts brushes to icons, but beware that some may chop off the extra bit
  101. planes needed to have 8 colours.  I have put zapicon on my Theme Disk,
  102. because it is this program that I use.  To convert a brush called MD10.fb,
  103. you would simply enter the CLI and type:
  104.         zapicon MD10.fb MD10.fi
  105. The icon would be saved as MD10.fi! (I use .fi and .bi to indicate front and
  106. back icons!)  If you are making a single image icon only, then your job is
  107. nearly finished, but if you are making a two image icon then you must
  108. convert the other brush as well, using the same command, so its not that
  109. much more difficult is it??
  110.  
  111. Now you need to merge the two images into one icon, and again some programs
  112. may cut off the extra bit planes so be careful.  Iconmerge is the most
  113. popular in this area because it works for 8 colours and can be run from the
  114. CLI or Workbench.  From the CLI, just type iconmerge, and answer the relevant
  115. questions afterwards.  From Workbench, just click on the icon and answer the
  116. questions.  You will be asked for the first (unselected) icon name, the
  117. second (selected) icon name, and then a name to output the merged icon to.
  118. Remember to add full path names for each filename.
  119.  
  120. So now you've got a pretty icon that when you click it changes to another
  121. "selected" type icon.  (Incidently, if you've saved an icon, but can't find
  122. it in an already open window, then that is because its not really there.
  123. When you close the window and re-open it, you will hopefully find it.  Also,
  124. some programs do not add .info to the end of the icon name.  You can rename
  125. a file to contain this or save it with the appendage, because without it
  126. Workbench doesn't recognize it as an icon file!)
  127.  
  128. The next step is to decide what sort of icon it is.  This was my headache
  129. department when first playing with 8 colour icons, because all the programs
  130. I had used to set the type (Icontype etc..) ripped of the 8 colour.
  131. Icontype did work fine for everything but Drawers.  A phone call to Tim
  132. Strachan revealed he had the same problem, and a phone call to Queensland
  133. revealed the solution : Iconimage!!  I now use Iconimage to do all icons,
  134. because it is by far the simplest method.  All it does is simply replace the
  135. "picture" data in an icon file.  Therefore you can save a file with the old
  136. notepad, then tell iconimage to put the icon you designed in place of the
  137. notepad icon and it will do just that.  Iconimage is invokable from the CLI
  138. and workbench, which makes it also that little bit easier.
  139.  
  140. For example, suppose you saved a icon for a drawer that you just did as
  141. "MYICON", and you wish it to represent the "System" drawer.  You would simply
  142. feed "System" name to iconimage as the old icon, and "MYICON" as the new
  143. icon.  Providing all has been successful (pathnames...), then when you open
  144. the window you will have your icon staring you in the face representing the
  145. "System" drawer.  The icon artwork is thus complete.
  146.  
  147. Well, I hope that you have learnt something from this article, and indeed
  148. hope that you will be able to utilize my workdisk.  I have a good deal of
  149. fun working with icons, and I'm sure that you will also once you get the
  150. hang of it, but remember to play with backups of your software just to be
  151. safe!!  Have Fun!!!
  152.  
  153.  
  154.